//传递自定义参数

import { useState } from "react";

//传递自定义参数
function App() {
  const [message, setMessage] = useState("");
  const clickHandler = (name) => {
    // 在括号内加 形参e 即可
    const fufu = "button按钮点击了";
    setMessage(fufu);
    console.log("button按钮点击了", name);
  };
  // 语法：事件绑定的位置改造成箭头函数的写法，
  // 在执行clickHandler实际处理业务函数的时候传递实参

  const click1 = (e) => {
    console.log(e.target);
  };
  const click2 = (e, name) => {
    console.log(e);
    console.log(e.target, name);
  };
  return (
    <>
      <h1>--携带参数--</h1>
      <div>{message}</div>
      <div>{message}</div>
      <button onClick={() => clickHandler("jkl")}>click me</button>
      <hr></hr>
      <button onClick={click1}>click1</button>
      <button onClick={(e) => click1(e)}>click1</button>
      <br></br>
      {/* click1的 两个都一样 */}
      <button onClick={(e) => click2(e, "qqq")}>click2</button>
    </>
  );
}

export default App;
